<template>
  <h2 class="borderTitle"><slot></slot></h2>
</template>
<script>
export default {};
</script>
<style lang="less" scoped>
.borderTitle {
  position: relative;
  padding-left: 9px;
  margin-bottom: 14px;
  font-size: 17px;
  height: 20px;
  line-height: 20px;
  &::before {
    content: "";
    position: absolute;
    left: 0;
    top: 70%;
    margin-top: -9px;
    width: 4px;
    height: 16px;
    border-left: 2px solid #5dcaa8;
    border-bottom: 3px solid #5dcaa8;
  }
  &::after{
    content: '';
    display: block;
    position: absolute;
    z-index: -1;
    top: 20%;
    left: 0;
    width: 100%;
    height: 100%;
    background:linear-gradient(to right,rgba(0,0,0,0) 0% , #efefef 5%, rgba(0,0,0,0) 50%);
  }
}
</style>
